<template>
  <div>
    <a-checkbox v-model="checkedAll" @change="doCheckAll">全部</a-checkbox>
    <a-checkbox-group v-model="checkedKeys" @change="doCheck">
      <a-checkbox v-for="(item, index) in treeData" :key="index" :value="item[dataFields.value]">{{item[dataFields.title]}}</a-checkbox>
    </a-checkbox-group>
  </div>
</template>
<script>
import TreeCheckJS from './ComboTreeCheck.js'
export default {
  mixins: [TreeCheckJS],
  data() {
    return {
      checkedAll: true,
    }
  },
  watch: {
    checkedKeys() {
      if (this.checkedKeys.length) {
        this.checkedAll = false
      } else {
        this.checkedAll = true
      }
    }
  },
  methods: {
    doCheckAll(e) {
      if (e.target.checked) {
        this.checkedKeys = []
      } else {
        if (this.checkedKeys.length) {
          this.checkedAll = false
        } else {
          this.checkedAll = true
        }
      }
      this.doCheck();
    }
  }
}
</script>
